<template>
    <div>
        <div class="page_top">
            <div class="left_btn" @click="back">
                <img src="../../assets/image/back.png" alt="" />
            </div>
            <crumbs basetitle="工具" title="保司迁移"></crumbs>
        </div>
        <div class="content">
            <filterComponent v-model:filter-data="filterData" @doSearch="handleSearch" />
            <el-card style="margin-top: 20px">
                <div class="myflex">
                    <div class="myflex-top">
                        <div>列表</div>
                        <el-button type="primary" @click="onHistory">保司迁移记录</el-button>
                    </div>
                    <!-- <div>
                        <el-tooltip
                            :visible="visible"
                            class="box-item"
                            effect="dark"
                            content="请勾选后再操作"
                            placement="bottom"
                        >
                            <el-button
                                type="primary"
                                @mouseleave="visible = false"
                                @click="yjgh"
                                >一键更换</el-button
                            >
                        </el-tooltip>
                    </div> -->
                </div>
                <!-- <tableComponent
                    :table-header="tableHeader"
                    :needDetail="true"
                    :table-data="tableData"
                    v-model:page-info="pageInfo"
                    selection
                    @pageChange="handlePageChange"
                    @selectionChange="handleSelectionChange"
                > -->
                <tableComponent :table-header="tableHeader" :needDetail="true" :table-data="tableData"
                    v-model:page-info="pageInfo" @pageChange="handlePageChange"
                    @selectionChange="handleSelectionChange">
                    <template #insurCompany>
                        <el-table-column label="当前保司">
                            <template #default="scope">
                                <template v-for="item in bslist" :key="item.dictValue">
                                    <div v-if="scope.row.insurCompany == item.dictValue">
                                        {{ item.dictLabel }}
                                    </div>
                                </template>
                            </template></el-table-column>
                    </template>
                    <template #count>
                        <el-table-column label="在保人数" width="100">
                            <template #default="scope">
                                <el-popover :ref="(el: any) => setRefs(el, scope.row)" trigger="hover" placement="right"
                                    width="930" :popper-options="{
                                        boundariesElement: 'viewport',
                                    }" @before-enter="beforeenter(scope.row)">
                                    <template #reference>
                                        <div class="blue pointer">
                                            {{ scope.row.count }}
                                        </div>
                                    </template>
                                    <el-table :header-cell-style="{
                                        background: '#FAFAFC',
                                        color: '#202536',
                                    }" :data="tcdate" max-height="300" width="100%">
                                        <el-table-column width="100" property="userName" label="姓名" />
                                        <el-table-column width="200" property="idCardNo" label="身份证号" />
                                        <el-table-column width="200" property="companyPlanName" label="方案名称" />
                                        <el-table-column width="200" property="insurStartTime" label="生效时间" />
                                        <el-table-column width="200" property="insurEndTime" label="结束时间" />
                                    </el-table>
                                </el-popover>
                            </template>
                        </el-table-column>
                    </template>
                    <template #operate>
                        <el-table-column fixed="right" label="操作">
                            <template #default="scope">
                                <!-- <el-button link type="primary" @click="toczrz(scope.row)" size="small">操作日志</el-button> -->
                                <el-button link type="primary" @click="ghbs(scope.row)" size="small">更换保司</el-button>
                            </template>
                        </el-table-column>
                    </template>
                </tableComponent>
            </el-card>
        </div>
        <el-dialog v-model="dialogTableVisible" title="操作日志" width="600">
            <tableComponent :table-header="tableHeader1" :needDetail="true" :table-data="tableData1"
                v-model:page-info="pageInfo1" @pageChange="handlePageChange1">
            </tableComponent>
        </el-dialog>
        <el-dialog v-model="dialogTableVisibleHistory" title="保司迁移记录" width="1000">
            <tableComponent :table-header="tableHeaderHistory" :table-data="tableDataHistory"
                v-model:page-info="pageInfoHistory" @pageChange="handlePageChangeHistory">
                <template #laterInsurCompany>
                    <el-table-column prop="" label="当前保司">
                        <template #default="scope">
                            <template v-for="item in bslist" :key="item.dictValue">
                                <div v-if="scope.row.laterInsurCompany == item.dictValue">
                                    {{ item.dictLabel }}
                                </div>
                            </template>
                        </template>
                    </el-table-column>
                </template>
                <template #beforeInsurCompany>
                    <el-table-column prop="" label="原保司">
                        <template #default="scope">
                            <template v-for="item in bslist" :key="item.dictValue">
                                <div v-if="scope.row.beforeInsurCompany == item.dictValue">
                                    {{ item.dictLabel }}
                                </div>
                            </template>
                        </template>
                    </el-table-column>
                </template>
                <template #operate>
                    <el-table-column prop="" width="200" label="操作">
                        <template #default="scope">
                            <el-popover trigger="hover" placement="left" width="370"
                                @before-enter="beforeenterc(scope.row)">
                                <template #reference>
                                    <el-button link type="primary" size="small">详情</el-button>
                                </template>
                                <div class="pd-b-20">详情</div>
                                <el-table :header-cell-style="{
                                    background: '#FAFAFC',
                                    color: '#202536',
                                }" :data="scope.row.migrationOperationLogDetails">
                                    <el-table-column property="beforeInsurCompany" label="原保司方案">
                                        <template #default="scope">
                                            <template v-for="item in bslist" :key="item.dictValue">
                                                <div v-if="scope.row.beforeInsurCompany == item.dictValue">
                                                    {{ item.dictLabel }}
                                                </div>
                                            </template>
                                        </template></el-table-column>
                                    <el-table-column property="laterInsurCompany" label="当前保司方案">
                                        <template #default="scope">
                                            <template v-for="item in bslist" :key="item.dictValue">
                                                <div v-if="scope.row.laterInsurCompany == item.dictValue">
                                                    {{ item.dictLabel }}
                                                </div>
                                            </template>
                                        </template></el-table-column>
                                    <el-table-column property="totalCount" label="操作人数" />
                                </el-table>
                            </el-popover>
                            <el-button v-if="scope.row.revokeStatus===0" link type="primary" @click="onRevocation(scope.row)" size="small">撤销</el-button>
                        </template>
                    </el-table-column>
                </template>
            </tableComponent>
        </el-dialog>
        <el-dialog v-model="dialogTableVisiblerevocation" title="保司迁移详情" width="400">
            <tableComponent noPagination :table-header="tableHeaderrevocation" :table-data="tableDatarevocation">
                <template #laterInsurCompany>
                    <el-table-column prop="" label="当前保司">
                        <template #default="scope">
                            <template v-for="item in bslist" :key="item.dictValue">
                                <div v-if="scope.row.laterInsurCompany == item.dictValue">
                                    {{ item.dictLabel }}
                                </div>
                            </template>
                        </template>
                    </el-table-column>
                </template>
                <template #beforeInsurCompany>
                    <el-table-column prop="" label="原保司">
                        <template #default="scope">
                            <template v-for="item in bslist" :key="item.dictValue">
                                <div v-if="scope.row.beforeInsurCompany == item.dictValue">
                                    {{ item.dictLabel }}
                                </div>
                            </template>
                        </template>
                    </el-table-column>
                </template>
            </tableComponent>
            <template #footer>
                <el-button @click="dialogTableVisiblerevocation = false">取消</el-button>
                <el-button @click="onMigrationOperationLogRevoke" type="primary">确定撤销</el-button>
            </template>
        </el-dialog>
        <el-dialog v-model="dialogTableVisible1" title="一键更换保司" width="600">
            <div class="ghbsbox">
                <div class="mgb-24">
                    <span class="bord mgr-16">已选信息</span><span class="light">转移保司：</span><span class="mgr-16">
                        <template v-for="item in bslist" :key="item.dictValue">
                            <span v-if="beforeInsurCompany == item.dictValue">
                                {{ item.dictLabel }}
                            </span>
                        </template>
                    </span>
                    <span v-if="showflag === 0"><span class="light">转移人数:</span><span>{{ count }}</span></span>
                    <span v-if="showflag === 1"><span class="light">转移企业:</span><span>{{ pageInfo.total }}</span></span>
                    <span v-if="showflag === 2"><span class="light">转移企业:</span><span>{{ selected.length
                            }}</span></span>
                </div>
                <div class="bord mgb-14">更换保司</div>
                <div class="mgb-24">
                    <el-select v-model="changebsvalue" class="m-2" placeholder="请选择" style="width: 240px">
                        <el-option v-for="item in bslist" :key="item.dictValue" :label="item.dictLabel"
                            :value="item.dictValue" />
                    </el-select>
                </div>
                <!-- <div class="mgb-24">
                    <span class="bord mgr-16">减保时间</span>
                    {{
                        dayjs(changejbdatevalue)
                            .subtract(1, 'day')
                            .format('YYYY-MM-DD')
                    }}
                </div> -->
                <div class="bord mgb-14">减保时间</div>
                <div class="mgb-14">
                    <el-date-picker v-model="changejbdatevalue1" type="date" placeholder="请选择减时间"
                        :disabled-date="disabledDate1" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                </div>
                <div class="bord mgb-14">加保时间</div>
                <div>
                    <el-date-picker v-model="changejbdatevalue" type="date" placeholder="请选择加保时间"
                        :disabled-date="disabledDate" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                </div>
            </div>
            <template #footer>
                <div class="flexc">
                    <el-button type="" @click="dialogTableVisible1 = false">取消</el-button>
                    <el-button type="primary" @click="changesure">确定</el-button>
                </div>
            </template>
        </el-dialog>
        <el-dialog v-model="dialogTableVisible2" title="保司迁移" width="800">
            <el-table :data="alonebsqydata" table-layout="auto" border>
                <el-table-column prop="companyPlanName" label="已选保司方案" />
                <el-table-column prop="totalEnsureCount" label="当前在保" />
                <el-table-column prop="companyPlanId" label="是否关闭方案">
                    <template #default="scope">
                        <el-radio-group v-model="scope.row.isClosePlan" v-if="!scope.row.isheader">
                            <el-radio :value="0" size="large" border>打开</el-radio>
                            <el-radio :value="1" size="large"
                                :disabled="disarr.includes(scope.row.insurCompanyPlanCode)" border>关闭</el-radio>
                        </el-radio-group>
                    </template>
                </el-table-column>
                <el-table-column prop="companyPlanId" label="目标保司方案">
                    <template #default="scope">
                        <el-select v-model="scope.row.insurCompanyPlanCodec"
                            :disabled="scope.row.totalEnsureCount === 0" placeholder="" v-if="scope.row.isheader"
                            @change="changeheadbs">
                            <el-option v-for="item in scope.row.selectlist" :key="item.insureCompanyType"
                                :label="item.name" :value="item.insureCompanyType" />
                        </el-select>
                        <el-select v-model="scope.row.insurCompanyPlanCodec"
                            :disabled="scope.row.totalEnsureCount === 0" @change="onChangeInsureType" placeholder=""
                            v-if="!scope.row.isheader" clearable>
                            <el-option v-for="item in scope.row.selectlist" :key="item.planCode" :label="item.planName"
                                :value="item.planCode" />
                        </el-select>
                    </template>
                </el-table-column>
            </el-table>
            <div class="flex-b">
                <div class="flex-c">
                    <div class="bord">减保时间：</div>
                    <div>
                        <el-date-picker v-model="changejbdatevalue1inner" type="date" placeholder="请选择减时间"
                            :disabled-date="disabledDate1" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                    </div>
                </div>

                <div class="flex-c">
                    <div class="bord">加保时间：</div>
                    <div>
                        <el-date-picker v-model="changejbdatevalueinner" type="date" placeholder="请选择加保时间"
                            :disabled-date="disabledDate" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
                    </div>
                </div>
            </div>
            <template #footer>
                <el-button type="" @click="dialogTableVisible2 = false">取消</el-button>
                <el-button type="primary" @click="changesure">确定</el-button>
            </template>
        </el-dialog>
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted, nextTick } from 'vue'
import { getcompanyapi } from '../../api/api'
import dayjs from 'dayjs'
import {
    getquerymigrationperiodlistapi,
    getquerymigrationperiodstafflistapi,
    migrationperioddataapi,
    getqueryperiodinsurancecompanyapi,
    querymigrationperiodplansbycompanyidapi,
    getwesureplansapi,
    getMigrationOperationLogListApi,
    MigrationOperationLogIiemDto,
    MigrationOperationLogDetailDto,
    migrationOperationLogRevokeApi
} from '../../api/baoSiQianYi/baoSiQianYi'
import { ElMessage, ElMessageBox } from 'element-plus'
const dialogTableVisibleHistory = ref(false)
const dialogTableVisiblerevocation = ref(false)

const bsqyinnerlist = ref<any>([])
const headlist = ref<any>([])
const footlist = ref<any>([])
const beforeInsurCompany = ref('')
const companyId = ref('')
const count = ref('')
const dialogTableVisible = ref(false)
const dialogTableVisible1 = ref(false)
const dialogTableVisible2 = ref(false)
const operationLogId = ref('')
const disarr = ref<any>([])
const onRevocation = (val: any) => {
    console.log(val)
    tableDatarevocation.value = val.migrationOperationLogDetails
    operationLogId.value = val.operationLogId
    dialogTableVisiblerevocation.value = true
}
const onMigrationOperationLogRevoke = () => {
    ElMessageBox.confirm('确定撤销吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    }).then(() => {
        console.log('确定')
        migrationOperationLogRevokeApi({
            operationLogId: operationLogId.value
        }).then((res: any) => {
            console.log(res)
            if (res) {
                ElMessage({
                    type: 'success',
                    message: '撤销成功'
                })
                dialogTableVisiblerevocation.value = false
                pageInfoHistory.value.pageNum = 1
                pageInfo.value.pageNum = 1
                getMigrationOperationLogList()
                getData()
            }
        })
    }).catch(() => {
        console.log('取消')
    })

}
const onChangeInsureType = (val: any) => {
    console.log(val, 'jhsghj')
    alonebsqydata.value.forEach((ele: any, i: number) => {
        if (ele.insurCompanyPlanCode === val) {
            if (i !== 0) {
                ele.isClosePlan = 0
                ele.insurCompanyPlanCodec = ''
            }
        }
    })
    disarr.value = alonebsqydata.value.map((ele: any, i: number) => {
        return ele.insurCompanyPlanCodec
    })
}

const changeheadbs = (val: any) => {
    disarr.value = []
    let arr: any = []
    bsqyinnerlist.value.forEach((ele: any, i: any) => {
        if (ele.insureCompanyType === val) {
            footlist.value.forEach((j: any) => {
                j.selectlist = ele.planCodes
                arr = ele.planCodes
            })
        }
    })
    footlist.value.forEach((ele: any, i: any) => {
        const filterData = arr.find(
            (j: any) =>
                ele.companyPlanName.replace(/\D/g, '') === j.planName.replace(/\D/g, '')
        )
        if (filterData && ele.totalEnsureCount === 0) {
            ele.insurCompanyPlanCodec = ''
        } else if (filterData && ele.totalEnsureCount !== 0) {
            ele.insurCompanyPlanCodec = filterData.planCode
        } else {
            ele.insurCompanyPlanCodec = ''
        }
    })
}
const alonebsqydata = ref<any>([{ value: 1, lable: 1 }])
const visible = ref(false)
const yjgh = () => {
    // if (filterData.value.list.insureCompany.value === "") {
    //   visible.value = true;
    //   // ElMessage({
    //   //     type: 'warning',
    //   //     message: '请选择保司'
    //   // });
    //   return;
    // }
    if (selected.value.length === 0) {
        visible.value = true
        return
    } else {
        showflag.value = 2
        dialogTableVisible1.value = true
        beforeInsurCompany.value = filterData.value.list.insureCompany.value
        changebsvalue.value = ''
        changejbdatevalue.value = dayjs(new Date()).add(1, 'day').format('YYYY-MM-DD')
        changejbdatevalue1.value = dayjs(new Date()).format('YYYY-MM-DD')
    }
}
const showflag = ref(0)
const disabledDate = (time: Date) => {
    const currentDate = dayjs().format('YYYY-MM-DD')
    return dayjs(time).format('YYYY-MM-DD') <= currentDate
}
const disabledDate1 = (time: Date) => {
    const currentDate = dayjs().format('YYYY-MM-DD')
    return dayjs(time).format('YYYY-MM-DD') < currentDate
}
const poprefs = ref({}) as any
const setRefs = (el: any, row: any) => {
    poprefs[row.companyId + row.insurCompany] = el
}
const tcdate = ref<any>([])
const beforeenter = (val: any) => {
    tcdate.value = []
    getquerymigrationperiodstafflistapi(
        {
            companyId: val.companyId,
            insureCompany: val.insurCompany,
        },
        { noLoading: true }
    ).then((res: any) => {
        tcdate.value = res
        nextTick(() => {
            poprefs[
                val.companyId + val.insurCompany
            ].popperRef.popperInstanceRef.update()
        })
    })
}
const beforeenterc = (val: any) => {
    // tableDatarevocation.value = val.migrationOperationLogDetails
    // getquerymigrationperiodstafflistapi(
    //     {
    //         companyId: val.companyId,
    //         insureCompany: val.insurCompany,
    //     },
    //     { noLoading: true }
    // ).then((res: any) => {
    //     tcdate.value = res
    // nextTick(() => {
    //     poprefs[
    //         val.companyId + val.insurCompany
    //     ].popperRef.popperInstanceRef.update()
    // })
    // })
}
onMounted(() => {
    getData()
    getqueryperiodinsurancecompanyapi().then((res: any) => {
        console.log(res, 'huigsdhiud')
        filterData.value.list.insureCompany.options = res
        bslist.value = res
    })
})
const changejbdatevalue = ref('')
const changejbdatevalue1 = ref('')
const changejbdatevalueinner = ref('')
const changejbdatevalue1inner = ref('')
const changebsvalue = ref('')
const bslist = ref<any>([])
const toczrz = (val: any) => {
    dialogTableVisible.value = true
}
const changesure = () => {
    let obj: any = {}
    // if (showflag.value === 0) {
    // console.log(alonebsqydata.value[0].insurCompanyPlanCodec)
    // const res = alonebsqydata.value.find((j: any) => (j.insurCompanyPlanCodec === '' && j.totalEnsureCount !== 0 && j.isClosePlan === 0))
    const arr1: any = []
    const arr2: any = []

    alonebsqydata.value.forEach((j: any, i: number) => {
        if (i !== 0 && j.insurCompanyPlanCodec === '') {
            arr1.push(j)
        }
    })
    alonebsqydata.value.forEach((j: any, i: number) => {
        if (i !== 0 && j.isClosePlan === 0) {
            arr2.push(j)
        }
    })
    // console.log(arr1)
    // console.log(arr2)
    // console.log(alonebsqydata.value.length - 1)
    const flag1 = arr1.length === alonebsqydata.value.length - 1 ? true : false
    const flag2 = arr2.length === alonebsqydata.value.length - 1 ? true : false
    const endflag = flag1 === true && flag2 === true ? false : true



    // if (!res) {
    if (endflag) {
        obj = {
            beforeInsurCompany: beforeInsurCompany.value,
            laterInsurCompany: alonebsqydata.value[0].insurCompanyPlanCodec,
            ensurDate: changejbdatevalueinner.value
                ? changejbdatevalueinner.value
                : dayjs(new Date()).format('YYYY-MM-DD'),
            terminalDate: changejbdatevalue1inner.value
                ? changejbdatevalue1inner.value
                : dayjs(new Date()).format('YYYY-MM-DD'),
            companyId: companyId.value,
        }
        const arr: any = []
        alonebsqydata.value.forEach((ele: any, i: any) => {
            if (i !== 0) {
                console.log(ele)
                arr.push({
                    companyPlanId: ele.companyPlanId,
                    laterInsurCompanyPlanCode: ele.insurCompanyPlanCodec,
                    isClosePlan: ele.isClosePlan
                })
            }
        })
        obj.plans = arr
    } else {
        if (alonebsqydata.value.length !== 1) {
            ElMessage({
                message: '请将目标保司方案补充完整',
                type: 'warning',
            })
            return
        }
    }
    // } else if (showflag.value === 1) {
    //     obj = {
    //         beforeInsurCompany: beforeInsurCompany.value,
    //         laterInsurCompany: changebsvalue.value,
    //         ensurDate: changejbdatevalue.value
    //             ? changejbdatevalue.value
    //             : dayjs(new Date()).format('YYYY-MM-DD'),
    //         terminalDate: changejbdatevalue1.value
    //             ? changejbdatevalue1.value
    //             : dayjs(new Date()).format('YYYY-MM-DD'),
    //         // companyId: '',
    //         // companyIds: []
    //     }
    // } else {
    //     const arr: any = []
    //     selected.value.forEach((ele: any, i: any) => {
    //         arr.push(ele.companyId)
    //     })
    //     obj = {
    //         beforeInsurCompany: beforeInsurCompany.value,
    //         laterInsurCompany: changebsvalue.value,
    //         ensurDate: changejbdatevalue.value
    //             ? changejbdatevalue.value
    //             : dayjs(new Date()).format('YYYY-MM-DD'),
    //         terminalDate: changejbdatevalue1.value
    //             ? changejbdatevalue1.value
    //             : dayjs(new Date()).format('YYYY-MM-DD'),
    //         companyIds: arr,
    //         // companyId: ''
    //     }
    // }
    ElMessageBox.confirm(
        '关闭的方案将会被移除，请确认是否操作?',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        }
    )
        .then(() => {
            migrationperioddataapi({
                ...obj,
            }).then((res: any) => {
                console.log(res)
                if (res.code === 200) {
                    ElMessage({
                        type: 'success',
                        message: '迁移成功',
                    })
                    getData()
                    dialogTableVisible1.value = false
                    dialogTableVisible2.value = false
                }
            })
        })
}
const ghbs = async (val: any) => {
    console.log(val)
    dialogTableVisible2.value = true
    disarr.value = []
    changejbdatevalueinner.value = dayjs(new Date()).add(1, 'day').format('YYYY-MM-DD')
    changejbdatevalue1inner.value = dayjs(new Date()).format('YYYY-MM-DD')
    showflag.value = 0
    const resone: any = await querymigrationperiodplansbycompanyidapi({
        companyId: val.companyId,
        insurCompany: val.insurCompany,
    })
    const restwo: any = await getwesureplansapi({ type: 2 })
    console.log(bslist.value)
    bsqyinnerlist.value = restwo
    const obj: any = {}
    bslist.value.forEach((ele: any, i: any) => {
        if (ele.dictValue === val.insurCompany) {
            obj.companyPlanName = ele.dictLabel
            obj.totalEnsureCount = val.count
            obj.selectlist = restwo
            obj.isheader = true
            obj.insurCompanyPlanCodec = ''
        }
    })
    if (resone) {
        resone.forEach((ele: any, i: any) => {
            ele.selectlist = []
            ele.isheader = false
            ele.insurCompanyPlanCodec = ''
        })
    }
    headlist.value = [obj]
    footlist.value = resone
    const arr = [obj, ...resone]
    console.log(resone)
    arr.forEach((ele: any, i: number) => {
        ele.isClosePlan = 1
    })
    alonebsqydata.value = arr
    // changebsvalue.value = "";
    // dialogTableVisible1.value = true;
    // count.value = val.count;
    companyId.value = val.companyId
    beforeInsurCompany.value = val.insurCompany
}
const pageInfo = ref({
    pageNum: 1,
    pageSize: 10,
    total: 0,
})
const pageInfo1 = ref({
    pageNum: 1,
    pageSize: 10,
    total: 0,
})
const pageInfoHistory = ref({
    pageNum: 1,
    pageSize: 10,
    total: 0,
})
const tableData = ref([])
const tableData1 = ref([])
const tableDataHistory = ref([] as MigrationOperationLogIiemDto[])
const tableDatarevocation = ref([] as MigrationOperationLogDetailDto[])
const tableHeader = ref([
    {
        label: '公司名称',
        prop: 'companyName',
    },
    {
        label: '当前保司',
        prop: 'insurCompany',
    },
    {
        label: '当前在保人数',
        prop: 'count',
    },
    {
        label: '操作',
        prop: 'operate',
    },
])
const tableHeader1 = ref([
    {
        label: '操作人',
        prop: 'companyName',
        width: 200,
    },
    {
        label: '操作时间',
        prop: 'operationDate',
        width: 120,
    },
    {
        label: '操作明细',
        prop: 'deptName',
        width: 900,
    },
])
const tableHeaderrevocation = ref([
    {
        label: '原保司方案',
        prop: 'beforeInsurCompany',
    },
    {
        label: '当前保司方案',
        prop: 'laterInsurCompany',
    },
    {
        label: '操作人数',
        prop: 'totalCount',
    },
])

const tableHeaderHistory = ref([
    {
        label: '公司名称',
        prop: 'companyName',
        width: 200,
    },
    {
        label: '原保司',
        prop: 'beforeInsurCompany',
    },
    {
        label: '当前保司',
        prop: 'laterInsurCompany',
    },
    {
        label: '操作人数',
        prop: 'totalCount',
    },
    {
        label: '操作时间',
        prop: 'operationDate',
    },
    {
        label: '操作',
        prop: 'operate',
    },
])
const filterData = ref({
    list: {
        companyName: {
            width: 300,
            name: '公司名称',
            prop: 'companyName',
            value: '',
            placeholder: '请输入公司名称',
            type: 'inputSelect',
            options: [],
            defaultAttrs: {
                label: 'companyName',
                value: 'id',
            },
            remoteMethod: async (val: any, i: any) => {
                if (val) {
                    const res: any = await getcompanyapi(val)
                    console.log(res, '获取公司列表')
                    const arr = res
                    i.options = arr
                }
            },
        },
        insureCompany: {
            name: '当前保司',
            prop: 'insureCompany',
            value: '',
            placeholder: '请选择',
            type: 'select',
            options: [],
            defaultAttrs: {
                label: 'dictLabel',
                value: 'dictValue',
            },
        },
    },
})

const handleSearch = () => {
    getData()
}
const handlePageChange = () => {
    getData()
}
const handlePageChange1 = () => {
    getData1()
}
const handlePageChangeHistory = () => {
    getDataHistory()
}
const getDataHistory = () => {
    console.log('获取迁移历史记录')
    getMigrationOperationLogList()
}
const getData = () => {
    getquerymigrationperiodlistapi({
        companyId: filterData.value.list.companyName.value,
        insureCompany: filterData.value.list.insureCompany.value,
        pageSize: pageInfo.value.pageSize,
        pageNum: pageInfo.value.pageNum,
    }).then((res: any) => {
        console.log(res, '234387385674786789457895896890')
        pageInfo.value.total = res.total
        tableData.value = res.rows
    })
}
const getData1 = () => { }
const back = () => {
    window.history.back()
}
const selected = ref([])
const handleSelectionChange = (ev: any) => {
    console.log(11111, ev)
    selected.value = ev
}
const getMigrationOperationLogList = async () => {
    const res = await getMigrationOperationLogListApi({
        pageNum: pageInfoHistory.value.pageNum,
        pageSize: pageInfoHistory.value.pageSize,
    })
    tableDataHistory.value = res.rows
    pageInfoHistory.value.total = res.total
}
const onHistory = async () => {
    pageInfoHistory.value.pageNum = 1
    pageInfoHistory.value.pageSize = 10
    pageInfoHistory.value.total = 0
    await getMigrationOperationLogList()
    dialogTableVisibleHistory.value = true
}
</script>

<style scoped lang="scss">
.mgb-24 {
    margin-bottom: 24px;
}

.mgb-14 {
    margin-bottom: 14px;
}

.mgr-16 {
    margin-right: 16px;
}

.light {
    color: #9497b1;
}

.bord {
    font-size: 15px;
    color: #3d3d3d;
    font-weight: 700;
}

.flexc {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.ghbsbox {
    margin-top: -20px;
    border-top: 1px solid #f4f4f7;
    padding-top: 26px;
}

.myflex {
    box-sizing: border-box;
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.content {
    max-height: 800px;
    overflow: auto;
    box-sizing: border-box;
    margin: 16px;
}

.set-height {
    height: calc(100vh - 355px);
}

.flex-b {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex-c {
    display: flex;
    align-items: center;
}

.myflex-top {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
</style>
